import {IListItem} from "./types";
import {computed, ref} from "vue";
import useUserStore from "@/store/userModule";
import useDepartStore from "@/store/departModule";
import {PaginationConfig} from "ant-design-vue/es/pagination";
import {USER_LIST_DEFAULT_PAGE_SIZE} from "@/constants/data";

export const departStore = useDepartStore()
export const userStore = useUserStore()

// 表格加载效果
export const isLoading = ref(true)

// 分页
export const paginationObj = computed<PaginationConfig>(() => {
    return {
        current: userStore.userInfo.page_info.current_page,
        defaultPageSize: USER_LIST_DEFAULT_PAGE_SIZE,
        pageSize: userStore.userInfo.page_info.page_size,
        total: userStore.userInfo.page_info.total_count,
        onChange: async (current_page, page_size) => {
            isLoading.value = true
            await userStore.requestUserListAction({
                current_page,
                page_size
            })
            isLoading.value = false
        }
    }
})

// 表格
export const dataSource = computed(() => {
    return userStore.userInfo.list.map((item, index) => {
        const currentDepart = departStore.departList.find(jItem => jItem.id === item.depart_id)
        const listItem: IListItem = {
            key: index,
            id: item.id,
            name: item.name,
            age: item.age,
            gender: item.gender,
            salary: item.salary,
            create_time: item.create_time,
            depart_id: item.depart_id,
            depart_name: currentDepart?.title || ""
        }
        return listItem
    })
})
export const columns = [
    {
        title: 'id',
        dataIndex: 'id',
        key: 'id',
        align: 'center'
    },
    {
        title: '姓名',
        dataIndex: 'name',
        key: 'name',
        align: 'center'
    },
    {
        title: '年龄',
        dataIndex: 'age',
        key: 'age',
        align: 'center'
    },
    {
        title: '性别',
        dataIndex: 'gender',
        key: 'gender',
        align: 'center'
    },
    {
        title: '薪资',
        dataIndex: 'salary',
        key: 'salary',
        align: 'center'
    },
    {
        title: '入职时间',
        dataIndex: 'create_time',
        key: 'create_time',
        align: 'center'
    },
    {
        title: '所属部门',
        dataIndex: 'depart_name',
        key: 'depart_name',
        align: "center"
    },
    {
        title: '操作',
        dataIndex: 'operation',
        key: 'operation',
        align: "center"
    },
]

